<template>

      <div class="hotAct">
      <div class="hotAct_title">
        <div>推荐链接</div>
      </div>
      <div class="boxcontainer">
           <!-- <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item v-for="(item,index) in data" :key="'item'+index" @click="go(item.linkUrl)">
                 <img :src="item.linkImage+'?width=500&height=300'" alt="">
      </van-swipe-item>
    </van-swipe> -->
    <div class="imgs">
        <div class="imgsitem">
  <img src="" alt=""><div>京城礼品</div>
        </div>

           <div class="imgsitem">
             <img src="" alt="">
   <div>公积金业务</div>
        </div>

           <div class="imgsitem">
  <img src="" alt=""> 
  <div>签到有礼</div>
        </div>

           <div class="imgsitem">
<img src="" alt=""> <div>推荐有礼</div>
        </div>
    </div>
      </div>
    </div>

</template>
<script>
export default {
    methods:{
      go(url){
        window.location.href = url;
      }
    },
    props:['data']
};
</script>
<style scoped>
.boxcontainer {
  width: 100%;

  margin-top: 0.2rem;
  padding-bottom: 0.15rem
}
img{
      width: 51%;
}

.hotAct {
  padding: 0.25rem;
  margin-top: 0.2rem;
  background: #fff;
}
.imgs{
  display: flex;
  align-items: center;
  justify-content: space-around;
  text-align: center
}
.imgsitem{
  flex: 1;
}
.imgsitem div{
  margin-top: -0.1rem;
  font-size: 0.25rem
}
.hotAct_title {
  border-left: 4px solid #dbb47f;
  box-sizing: border-box;
  padding-left: 0.2rem;
  font-weight: bold;
  display: flex;
  justify-content: space-between;
  align-items: center;
      font-size: 0.28rem;
}
.lookmore {
  color: #919191;
  font-size: 0.25rem;
    font-weight: initial;
}
.newList {
  width: 100%;
}
.itemList {
  padding-bottom: 0.1rem;
  border-bottom: 1px solid #eeeeee;
}
.listTitle {
  width: 100%;
  margin-top: 0.15rem;
  margin-bottom: 0.1rem;
}
.listContent {
  width: 100%;
  margin-top: 0.1rem;
  margin-bottom: 0.1rem;
  color: #999999;
  line-height: 0.45rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  font-size: 0.26rem;
}

.container {
  width: 100%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  padding-bottom: 1.2rem;
  background: #f6f5f5;
      overflow: hidden;
    overflow-y: auto;

}
.header {
  padding: 0.25rem;
  box-sizing: border-box;
  height: 4rem;
}
.header_name {
  color: #fff;
}
.mingpian {
  height: 2.5rem;
  background: #fff;
  margin-top: 0.6rem;
  border-radius: 0.05rem;
  position: relative;
  padding: 0.1rem;
  box-sizing: border-box;
}
.headerimg {
  position: absolute;
  left: 0.5rem;
  width: 1.5rem;
  height: 1.5rem;
  border: 2px solid #fff;
  top: -0.5rem;
  border-radius: 0.05rem;
}
.mingpian_more {
  position: absolute;
  left: 0;
  top: 1.5rem;
  font-size: 0.23rem;
  padding: 0.13rem;
  background: rgba(0, 0, 0, 0.4);
  border-radius: 0 0.2rem 0.2rem 0;
  color: #fff;
}
.mingpian_msg {
  padding: 0.2rem;
  font-size: 0.25rem;
  width: 58%;
  float: right;
}
.user_name {
  color: #3f3f3f;
  font-size: 0.4rem;
  font-weight: bold;
}
.user_job {
  color: #3f3f3f;
  font-size: 0.3rem;
  font-weight: bold;
}
.item_targer {
  position: relative;
  display: inline-block;
  padding: 1px;
  padding-left: 3px;
  padding-right: 6px;
  color: #8b714b;
  font-size: 0.2rem;
}
.item_targer::before {
  z-index: 0;
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-transform: skewX(-10deg);
  transform: skewX(-10deg);
  border: 1px solid #8b714b;
}
.mingpian_targer {
  margin-top: 0.2rem;
}
.soket {
  display: flex;
  float: right;
  margin-top: 0.34rem;
}
.soket_button {
  background: #4c556a;
  padding: 0.1rem;
  color: #fff;
  width: 1rem;
  font-size: 0.3rem;
  text-align: center;
  margin-left: 10px;
  border-radius: 0.15rem;
  height: 0.36rem;
  line-height: 0.36rem;
}
.my-swipe .van-swipe-item {
    width: 100%;
}
img{
    width: 50%;
}
</style>